<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:t="http://myfaces.apache.org/tomahawk">

<h:head>
	<style type="text/css">
</style>
	<meta charset="utf-8" />
	<title>PigShare | Profil</title>
	<link href='http://fonts.googleapis.com/css?family=Russo+One'
		rel='stylesheet' type='text/css' />
	<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</h:head>
<h:body>
	<div style="position: absolute; top: 50%; left: 0; border: none;">
		<a href="profile.xhtml?faces-redirect=true"><h:outputLabel
				style="font-family: 'Russo One', sans-serif; font-size:64px; font-color:black; width:170px; text-align:left;"
				value="PROFIL"></h:outputLabel></a>
		<h:outputLabel
			style="font-family: 'Russo One', sans-serif; font-size:39px; font-color:black; width:170px; margin-top:-24px; text-align:left;"
			value="STARTSEITE"></h:outputLabel>
		<a href="index.xhtml?faces-redirect=true"><h:outputLabel
				style="font-family: 'Russo One', sans-serif; font-size:40px; font-color:black; width:170px; margin-top:-18px;text-align:left;"
				value="AUSLOGGEN"></h:outputLabel></a>
	</div>
	<div
		style="margin-left: auto; margin-right: auto; width: 870px; height: 850px;">

		<div style="margin-left: auto; margin-right: auto;">
			<img src="images/logos/party.png" alt="logo"
				style="height: 190px; margin-bottom: 50px;" />
		</div>

		<div style="z-index: 0; margin-left: 40px; margin-bottom: -20px">
			<h:outputLink id="pfrofilelink" value="javascript:void(0)"
				onclick="profiledlg.show()" title="edit profile picture">
				<p:graphicImage value="images/tools/settings.png"
					style="border:0;width:25px;height:25px;" />
			</h:outputLink>

			<p:growl id="growly" showDetail="true" life="3000" />
			<p:growl id="growl" showDetail="true" life="3000" />

			<p:dialog id="profiledialog" header="Profil bearbeiten"
				widgetVar="profiledlg" dynamic="true">

				<h:panelGrid columns="1">
					<p:commandButton id="uploadpic" value="Neues Profilbild hochladen"
						onclick="uploadpic.show();" type="button" />
					<p:commandButton id="takepic"
						value="Neues Profilbild mit Cam machen" onclick="takepic.show();"
						type="button" />
					<p:separator id="separator" />
					<h:form style="">
						<h:panelGrid columns="2" cellpadding="5">
							<h:outputLabel for="username" value="Username:" />
							<p:inputText value="#{loginBean.username}" id="username"
								label="username" />

							<h:outputLabel for="email" value="Email:" />
							<p:inputText value="#{loginBean.email}" id="email" label="email" />

							<h:outputLabel for="vorname" value="Vorname:" />
							<p:inputText value="#{loginBean.vorname}" id="vorname"
								label="vorname" />

							<h:outputLabel for="nachname" value="Nachname:" />
							<p:inputText value="#{loginBean.nachname}" id="nachname"
								label="nachname" />

							<f:facet name="footer">
								<p:commandButton id="loginButton" value="Speichern"
									update=":growl" actionListener="#{loginBean.updateUser}"
									oncomplete="/profile.xhtml" />
							</f:facet>

						</h:panelGrid>
					</h:form>

				</h:panelGrid>
			</p:dialog>

			<p:dialog id="uploadpic2" header="Neues Profilbild hochladen"
				widgetVar="uploadpic" modal="true" dynamic="true">
				<h:form enctype="multipart/form-data">
					<h:panelGrid columns="2" cellpadding="3">
						<h:outputLabel for="actpicture" value="Aktuelles Bild:" />
						<p:graphicImage style="width:200px" value="#{imageBean.content}" />

						<t:inputFileUpload style="width:150px"
							value="#{updateProfilePictureBean.uploadedFile}" />
						<h:commandButton style="width:190px" value="neues bild hochladen"
							action="#{updateProfilePictureBean.submit}" />


					</h:panelGrid>
				</h:form>
			</p:dialog>

			<p:dialog id="takepic2" header="Neues Profilbild mit Kamera machen"
				widgetVar="takepic" modal="true" dynamic="true">
				<h:form>
					<h:panelGrid columns="2">
						<p:photoCam widgetVar="pc" listener="#{photoCamBean.oncapture}" />
						<h:outputLabel for="sadfsa" value="" />
						<p:commandButton type="button" value="Bild aufnehmen"
							update=":growl" onclick="pc.capture()"
							oncomplete="profiledlg.hide();" />
						<p:commandButton type="button" value="Zurück"
							onclick="takepic.hide();" />
					</h:panelGrid>

				</h:form>
			</p:dialog>

			<script type="text/javascript">
				function handleLoginRequeste(xhr, status, args) {
					profiledlg.hide();
				}
			</script>
		</div>

		<div style="margin-left: 50px; width: 200px; height: 150px;">

			<p:dialog id="picture" widgetVar="picturedlg"
				header="Profilbild von #{loginBean.username}" dynamic="true"
				showEffect="clip" hideEffect="clip">

				<p:ajax event="close" update="growl"
					listener="#{dialogBean.handleClose}" />

				<p:graphicImage value="#{imageBean.content}" />

			</p:dialog>

			<h:outputLink id="openDialogLink" value="javascript:void(0)"
				onclick="picturedlg.show()">
				<p:graphicImage value="#{imageBean.content}"
					style="height:130px;margin-top:10px; margin-left:10px;" />
			</h:outputLink>
		</div>


		<div
			style="margin-top: -165px; margin-left: 260px; width: 670px; height: 700px;">
			<h:outputLabel
				style="font-family: 'Russo One', sans-serif; font-size:64px; font-color:black; text-align:left;"
				value="#{loginBean.username}"></h:outputLabel>
			<h:outputLabel
				style="font-family: 'Russo One', sans-serif; font-size:28px; font-color:black; width:470px; margin-top:-20px; text-align:left;"
				value="#{loginBean.vorname} - #{loginBean.nachname}"></h:outputLabel>
			<h:outputLabel
				style="font-family: 'Russo One', sans-serif; font-size:18px; font-color:black; width:470px; margin-top:-7px; text-align:left;"
				value="#{loginBean.email}"></h:outputLabel>
		</div>
		<div
			style="margin-top: -520px; margin-left: 50px; width: 200px; height: 300px;">
			<h:outputLink id="loginLink" value="javascript:void(0)"
				onclick="dlg.show()" title="login">

			</h:outputLink>


			<script type="text/javascript">
				function handleLoginRequest(xhr, status, args) {
					dlg.hide();
					//jQuery('#loginLink').fadeOut();
				}
			</script>

		</div>
		<div id="postbutton">

			<p:growl id="growlys" showDetail="true" life="3000" />

			<h:outputLink id="postlink" value="javascript:void(0)"
				onclick="postingdlg.show()">
				<p:graphicImage value="images/profile/postbutton.png"
					style="border:0;width:131px;height:32px;" />
			</h:outputLink>

			<p:dialog id="postDialog" header="Ein neues Bild posten"
				widgetVar="postingdlg" dynamic="true">
				<h:form enctype="multipart/form-data">
					<h:panelGrid columns="2">
						<h:outputLabel for="title" value="Titel:" />
						<p:inputText value="#{postBean.title}" id="title" label="title" />

						<h:outputLabel for="comment" value="Beschreibung:" />
						<p:inputText value="#{postBean.comment}" id="comment"
							label="comment" />

						<h:outputLabel for="file" value="Bild" />
						<t:inputFileUpload value="#{postBean.uploadedFile}" />

						<h:outputLabel for="sure" value="--" />
						<h:commandButton value="neues bild hochladen"
							action="#{postBean.submit}" />
					</h:panelGrid>

				</h:form>
			</p:dialog>
		</div>

		<h:form id="formus">

			<p:dataGrid var="lol" value="#{tableBean.fotos}" columns="3"
				rows="12" paginator="true"
				paginatorTemplate="{CurrentPageReport}  {FirstPageLink} {PreviousPageLink} {PageLinks} {NextPageLink} {LastPageLink} {RowsPerPageDropdown}"
				rowsPerPageTemplate="9,12,15">

				<p:column>
					<p:panel header="#{lol.id}" style="text-align:center">
						<h:panelGrid columns="1" style="width:100%">
							<p:graphicImage value="#{huhuBean.getContent(lol.id)}">
								<f:param id="action" name="action" value="#{lol.id}" />
								<f:param id="b" name="b" value="#{lol.id}" />
							</p:graphicImage>

							<h:outputText value="#{lol.kommentar}" />

						</h:panelGrid>
					</p:panel>
				</p:column>

			</p:dataGrid>
		</h:form>
		<div style="position: absolute; top: 210px; right: 0; border: none;">
			<script type="text/javascript">
			<!--
				google_ad_client = "ca-pub-5750428780375780";
				/* pigshare */
				google_ad_slot = "7022530796";
				google_ad_width = 120;
				google_ad_height = 600;
			//-->
			</script>
			<script type="text/javascript"
				src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
				
			</script>
		</div>






	</div>


</h:body>
</html>